<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../lib/vue.js"></script>
    <link crossorigin="anonymous" integrity="sha384-9GKi7Mg3e8wxMnh60bnNnc9kuwGfarF0StF1UbfPt4F5GMVfxBgfh8/pW4iHavxG"
          href="https://lib.baomitu.com/twitter-bootstrap/3.4.1/css/bootstrap.css" rel="stylesheet">
    <script crossorigin="anonymous" integrity="sha384-vk5WoKIaW/vJyUAd9n/wmopsmNhiy+L2Z+SBxGYnUkunIxVxAv/UtMOhba/xskxh"
            src="https://lib.baomitu.com/jquery/3.4.1/jquery.min.js"></script>
    <script crossorigin="anonymous" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd"
            src="https://lib.baomitu.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div id="app">
</div>

<script>
    var vm = new Vue({
        el:"#app",
        data:{

        },
        methods:{

        },
        filters:{//定义私有过滤器，过滤器有2个条件，名称、处理函数
            dataFormate:function (dataStr , pattern='') {
                //XXX
                //dataFormate为过滤器名称，后面的function为处理函数。剩下的就与之前学的一致了。
                //注意：这个dataFormate可以与外部的过滤器重名，但是在使用的时候，是使用的内部这个-->如果私有的过滤器和全局的过滤器同名，使用的是私有的，就近原则
            }
        },
        directives:{//定义私有指令带s，指令有2个条件，名称，对象---调用时候v-fontweight
            'fontweight':{//设置字体粗细
                bind:function (el , binding) {
                    el.style.fontWeight = binding.value
                }
            },
            'fontsize':function (el ,binding) {//这是一个简写，等同于把代码写到了bind和update中去
                // el.style.fontsize = binding.value
                el.style.fontsize = parseInt(binding.value) + 'px'//增加代码健壮性
            }
        }

    })

</script>

</body>
</html>